﻿<style type="text/css">
    .tabs_r {
      position: relative;
      min-height: 282px;  /*This part sucks */
      clear: both;
      margin: 10px 0;
    }
    .tab_r {
      float: left;
    }
    .tab_r label {
      background: #eee; 
      padding: 5px; 
      border: 1px solid #ccc; 
      margin-left: -1px; 
      position: relative;
      left: 1px;
      
      height: 24px;
      font-size: 20px;
	  color: #ff8800;/*#FFB105;*/
      text-transform : uppercase;
	  letter-spacing : -1px;
    }
    .tab_r [type=radio] {
      display: none;   
    }
    .content_r {
      position: absolute;
      top: 27px;
      left: 0;
      background: white;
      right: 0;
      bottom: 0;
      padding: 13px 0 0 1px;
      border: 1px solid #ccc;
    }
    [type=radio]:checked ~ label {
      background: white;
      border-bottom: 1px solid white;
      z-index: 2;
    }
    [type=radio]:checked ~ label ~ .content_r {
      z-index: 1;
      
    }
</style>
<!--end tab panel-->
<link href="../../../Content/slideimage/css/slideimage.css" rel="stylesheet" type="text/css" />
<script src="../../../Content/slideimage/js/lib.js" type="text/javascript"></script>
<script src="../../../Content/slideimage/js/jquery.cycle.all.js" type="text/javascript"></script>
<link href="../../../Content/colorbox/css/colorbox.css" rel="stylesheet" type="text/css" />
@*<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>*@
<script src="../../../Content/colorbox/js/jquery.colorbox.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function () {
        //slide photo-video event to elements
        $('.slider').cycle({
            fx: 'fade', // choose your transition type, ex: fade, scrollUp, shuffle,scrollHorz etc...		           
            speed: 'slow',
            timeout: 0,
            next: '.nextsale',
            prev: '.prevsale'
        });

        //Examples of how to assign the ColorBox event to elements
        $(".group1").colorbox({ rel: 'group1' });

        //Example of preserving a JavaScript event for inline calls.
        $("#click").click(function () {
            $('#click').css({ "background-color": "#f00", "color": "#fff", "cursor": "inherit" }).text("Open this window again and this message will still be here.");
            return false;
        });

    });
</script>
<!--end gallery-->

<div class="post">
    <div class="tabs_r">
        <div class="tab_r">
            <input type="radio" id="tab-8" name="tab-group-2" checked />
            <label for="tab-8">Góc ảnh</label>
            <div class="content_r">
                <div style="float: left;">
                    <div class="slider">
                        <div>
                            <a class="row-left-sale rel group1" href="../../../Content/images/photo/800x600_20110526112653-6E0A1380.jpg">
                                <div class="img-60">
                                    <img src="../../../Content/images/photo/thumbnail/71x71_20110526112653-6E0A1380.jpg"
                                        style="border: 0;" alt="1" />
                                </div>
                            </a>
                            <a class="row-left-sale rel group1" href="../../../Content/images/photo/800x600_20110526112646-F40829F5.jpg">
                                <div class="img-60">
                                    <img src="../../../Content/images/photo/thumbnail/71x71_20110526112646-F40829F5.jpg"
                                        style="border: 0;" alt="2" />
                                </div>
                            </a><a class="row-left-sale rel group1" href="../../../Content/images/photo/800x600_20110526112635-A8C70F0C.jpg">
                                <div class="img-60">
                                    <img src="../../../Content/images/photo/thumbnail/71x71_20110526112635-A8C70F0C.jpg"
                                        style="border: 0;" alt="3" />
                                </div>
                            </a><a class="row-left-sale rel group1" href="../../../Content/images/photo/800x600_20110526112624-72699361.jpg">
                                <div class="img-60">
                                    <img src="../../../Content/images/photo/thumbnail/71x71_20110526112624-72699361.jpg"
                                        style="border: 0;" alt="4" />
                                </div>
                            </a><a class="row-left-sale rel group1" href="../../../Content/images/photo/800x600_20110526112608-C10B7798.jpg">
                                <div class="img-60">
                                    <img src="../../../Content/images/photo/thumbnail/71x71_20110526112608-C10B7798.jpg"
                                        style="border: 0;" alt="6" />
                                </div>
                            </a><a class="row-left-sale rel group1" href="../../../Content/images/photo/800x600_20110526112601-D6750F91.jpg">
                                <div class="img-60">
                                    <img src="../../../Content/images/photo/thumbnail/71x71_20110526112601-D6750F91.jpg"
                                        style="border: 0;" alt="7" />
                                </div>
                            </a><a class="row-left-sale rel group1" href="../../../Content/images/photo/800x600_20110526112615-332CFCC4.jpg">
                                <div class="img-60">
                                    <img src="../../../Content/images/photo/thumbnail/71x71_20110526112615-332CFCC4.jpg"
                                        style="border: 0;" alt="5" />
                                </div>
                            </a><a class="row-left-sale rel group1" href="../../../Content/images/photo/800x600_20110526112450-F31E58EE.jpg">
                                <div class="img-60">
                                    <img src="../../../Content/images/photo/thumbnail/71x71_20110526112450-F31E58EE.jpg"
                                        style="border: 0;" alt="12" />
                                </div>
                            </a><a class="row-left-sale rel group1" href="../../../Content/images/photo/800x600_20110526112551-CEAE2D04.jpg">
                                <div class="img-60">
                                    <img src="../../../Content/images/photo/thumbnail/71x71_20110526112551-CEAE2D04.jpg"
                                        style="border: 0;" alt="8" />
                                </div>
                            </a><a class="row-left-sale rel group1" href="../../../Content/images/photo/800x600_20110526112546-4636DBA6.jpg">
                                <div class="img-60">
                                    <img src="../../../Content/images/photo/thumbnail/71x71_20110526112546-4636DBA6.jpg"
                                        style="border: 0;" alt="9" />
                                </div>
                            </a><a class="row-left-sale rel group1" href="../../../Content/images/photo/800x600_20110526112537-EB3EB57F.jpg">
                                <div class="img-60">
                                    <img src="../../../Content/images/photo/thumbnail/71x71_20110526112537-EB3EB57F.jpg"
                                        style="border: 0;" alt="10" />
                                </div>
                            </a><a class="row-left-sale rel group1" href="../../../Content/images/photo/800x600_20110526112457-B2A57897.jpg">
                                <div class="img-60">
                                    <img src="../../../Content/images/photo/thumbnail/71x71_20110526112457-B2A57897.jpg"
                                        style="border: 0;" alt="11" />
                                </div>
                            </a>
                        </div>
                        <!--end photo page 1-->
                        <div>
                            <a class="row-left-sale rel group1" href="../../../Content/images/photo/800x600_20110526112551-CEAE2D04.jpg">
                                <div class="img-60">
                                    <img src="../../../Content/images/photo/thumbnail/71x71_20110526112551-CEAE2D04.jpg"
                                        style="border: 0;" alt="8" />
                                </div>
                            </a><a class="row-left-sale rel group1" href="../../../Content/images/photo/800x600_20110526112546-4636DBA6.jpg">
                                <div class="img-60">
                                    <img src="../../../Content/images/photo/thumbnail/71x71_20110526112546-4636DBA6.jpg"
                                        style="border: 0;" alt="9" />
                                </div>
                            </a><a class="row-left-sale rel group1" href="../../../Content/images/photo/800x600_20110526112537-EB3EB57F.jpg">
                                <div class="img-60">
                                    <img src="../../../Content/images/photo/thumbnail/71x71_20110526112537-EB3EB57F.jpg"
                                        style="border: 0;" alt="10" />
                                </div>
                            </a><a class="row-left-sale rel group1" href="../../../Content/images/photo/800x600_20110526112457-B2A57897.jpg">
                                <div class="img-60">
                                    <img src="../../../Content/images/photo/thumbnail/71x71_20110526112457-B2A57897.jpg"
                                        style="border: 0;" alt="11" />
                                </div>
                            </a>
                        </div>
                        <!--end photo page 2-->
                    </div>
                    <!--end slide -->
                    
                    <div class="f-link-all">
                        <div class="move">
                            <a href="javascropt:;" class="left prevsale"></a>
                            <a href="javascropt:;" class="right nextsale"></a>
                        </div>
                    </div>
                    <!--end next -->
                </div>
        </div>
    </div>
    <!--end photo-->

    <div class="tab_r">
        <input type="radio" id="tab-9" name="tab-group-2" />
        <label for="tab-9">Video</label>
        <div class="content_r">
            <div style="margin: -12px 0 0 0px;">
                <iframe width="297" height="250" src="http://www.youtube.com/embed/NLs3dKkpAaY?rel=0&wmode=opaque" frameborder="0" allowfullscreen wmode="Opaque"></iframe>
                <!--end player-->
            </div>
        </div>
        <!--end video-->
    </div>
</div> 